﻿@using Xproject.Util;
@using Model.Util.DTO;
@using Model.Util;
@{
    Layout = null;
    string Domain = CommonHelper.GetAppSettings("Domin");
}
@model CategoryListModel
<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    @*1、Jquery组件引用*@
    <script src="~/Scripts/jquery-1.10.2.js"></script>

    @*2、bootstrap组件引用*@

    <script src="~/Scripts/bootstrap.js"></script>
    <link href="~/Content/bootstrap.css" rel="stylesheet" />

    <style type="text/css">
        /*分类树*/
#categoryTree {
padding-left: 15px;
margin-top: 15px;
text-align: left;
}

#categoryTree thead th {
background: #dbeffa;
font-weight: normal;
cursor: pointer;
padding: 4px 0;
padding-left: 10px;
}

#categoryTree table tbody th {
text-align: left;
font-weight: normal;
}

#categoryTree table tbody th span {
display: inline-block;
width: 16px;
height: 16px;
cursor: pointer;
}

#categoryTree table tbody th span.openthis {
background: url('../../Content/images/tree_open.gif') no-repeat center center;
                        
}

        #categoryTree table tbody th span.closethis {
            background: url('../../Content/images/tree_close.gif') no-repeat center center;
        }

#categoryTree tbody td, #categoryTree tbody th {
border-bottom: 1px solid #ececec;
padding: 4px 0;
padding-left: 10px;
}

#categoryTree table tbody tr {
display: table-row;
}

#categoryTree table tbody tr.tree1 {
display: table-row;
}
.clear {
clear: both;
}

.left {
float: left;
}

.right {
float: right;
}
/*右侧Right*/
.rightH1 {
border-bottom: 2px solid #93aebf;
font-size: 12px;
color: #135275;
height: 30px;
line-height: 30px;
position: relative;
margin-left: 15px;
}

.rightH1 div {
    font-size: 14px;
    position: absolute;
    top: 3px;
    *top: 3px;
    _top: 10px;
    right: 0px;
    _right: 5px;
}

.rightH1 img {
    width: 32px;
    height: 24px;
}  
    </style>

    @*3、bootstrap table组件以及中文包的引用*@
    <script src="~/Content/bootstrap-table/bootstrap-table.js"></script>
    <script src="~/Content/bootstrap-table/locale/bootstrap-table-zh-CN.js"></script>
    <script src="~/Scripts/layer/layer.js"></script>
    <link type="text/css" rel="stylesheet" href="/admin_mall/content/css/site.css" />
    <script type="text/javascript" src="/admin_mall/scripts/showlist.js"></script>
    <script type="text/javascript">
        //分类树展开/关闭
        function categoryTree(obj, layer) {
            var state = $(obj).attr("class");
            if (state == "openthis") {
                $(obj).parent().parent().nextAll().each(function (index) {

                    var flag = parseInt($(this).attr("layer")) - layer;
                    if (flag == 1) {
                        $(this).show();
                    }
                    else if (flag == 0) {
                        return false;
                    }
                })
                $(obj).removeClass("openthis").addClass("closethis");
            }
            else if (state == "closethis") {
                $(obj).parent().parent().nextAll().each(function (index) {
                    if (parseInt($(this).attr("layer")) > layer) {
                        $(this).hide();
                        $(this).find("th span").each(function (i) {
                            if ($(this).attr("class") != "") {
                             //   $(this).removeClass("closethis").addClass("openthis");
                            }
                        })
                    }
                    else {
                        return false;
                    }
                })
                $(obj).removeClass("closethis").addClass("openthis");
            }
        }

        function DelCategory(obj,categoryId) {
            layer.confirm('确认删除此分类？', {
                btn: ['确认', '取消'] //按钮
            }, function () {

                    $.ajax({
                         url: "@(Domain+ "/Category/DelCategory")",
                    type: 'post',
                    cache: 'false',
                    async: 'false',
                    data: { cateId: categoryId },
                    success: function (data) {
                        if (data.Success == true) {
                            layer.alert('删除成功', { icon: 1, skin: 'layer-ext-moon', time: 2000 });
                           
                            $(obj).parent().parent().remove();
                        } else {
                            layer.alert('删除失败', { icon: 1, skin: 'layer-ext-moon', time: 2000 });
                        }
                           },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {

                        }
                    });


                }, function () {
                    layer.closeAll('dialog');
                }
               );

        }
    </script>
    
</head>
<body>
    <h1 class="rightH1">
        分类管理 &gt;&gt; 分类列表
        <div class="right">
            <a href="@Url.Action("Addcategory")" class="menuBT"><img src="../../content/images/add.jpg" />添加</a>
            <div class="clear">
            </div>
        </div>
        <div class="clear">
        </div>
    </h1>
    <div class="table_top"></div>

    <div id="categoryTree">
        <table width="100%">
            <thead>
                <tr>
                    <th align="left">分类名称</th>
                    <th align="left">分类ID</th>
                    <th align="left">价格范围</th>
                    <th width="50" align="left">排序</th>
                    <th width="250" align="left">管理操作</th>
                </tr>
            </thead>
            <tbody>
                @foreach (Category info in Model.CategoryList)
                {
                <tr layer="@info.Layer">
                    <th>
                        @Html.Raw(CommonHelper.GetHtmlSpan(info.Layer - 1))
                        <span @if (info.HasChild == 1) { <text> class="closethis" </text> } onclick="categoryTree(this,@info.Layer)"></span>
                        @info.Name
                    </th>
                    <td>@info.CategoryID</td>
                    <td>@info.PriceRange</td>
                    <td>@info.DisplayOrder</td>
                    <td>
                        <a href="@Url.Action("AttributeGroupList", new { cateId = info.CategoryID })" class="editOperate">[属性分组]</a>
                        <a href="@Url.Action("AttributeList", new { cateId = info.CategoryID })" class="editOperate">[属性列表]</a>
                        <a href="@Url.Action("EditCategory", new { cateId = info.CategoryID })" class="editOperate">[修改]</a>
                        <a href="#" onclick="DelCategory(this,'@info.CategoryID')" class="deleteOperate">[删除]</a>
                    </td>
                </tr>
                }
            </tbody>
        </table>
    </div>

    <div class="table_bottom"></div>


</body>
</html>